home *** CD-ROM | disk | FTP | other *** search
/ Cricao de Sites - 650 Layouts Prontos / WebMasters.iso / Codigos_Prontos / CSS / Outros / CSS tabs.txt next >
Encoding:
Text File  |  2008-08-19  |  2.2 KB  |  108 lines
  1. HTML
  2.  
  3.     <div id="navcontainer">
  4.     <ul id="navlist">
  5.     <li id="active"><a href="#" id="current">Item one</a></li>
  6.     <li><a href="#">Item two</a></li>
  7.     <li><a href="#">Item three</a></li>
  8.     <li><a href="#">Item four</a></li>
  9.     <li><a href="#">Item five</a></li>
  10.     </ul>
  11.     </div>
  12.  
  13. CSS
  14.     #navlist{
  15.       border-bottom: 1px solid #ccc;
  16.         margin: 0;
  17.       padding-bottom: 19px;
  18.       padding-left: 10px;
  19.     }
  20.  
  21.     #navlist ul, #navlist li{
  22.       display: inline;
  23.       list-style-type: none;
  24.       margin: 0;
  25.       padding: 0;
  26.      }
  27.  
  28.     #navlist a:link, #navlist a:visited{
  29.       background: #E8EBF0;
  30.         border: 1px solid #ccc;
  31.       color: #666;
  32.       float: left;
  33.       font-size: small;
  34.       font-weight: normal;
  35.       line-height: 14px;
  36.       margin-right: 8px;
  37.       padding: 2px 10px 2px 10px;
  38.       text-decoration: none;
  39.     }
  40.  
  41.     #navlist a:link#current, #navlist a:visited#current{
  42.       background: #fff;
  43.       border-bottom: 1px solid #fff;
  44.       color: #000;
  45.     }
  46.  
  47.     #navlist a:hover { color: #f00; }
  48.  
  49.       body.section-1 #navlist li#nav-1 a,
  50.       body.section-2 #navlist li#nav-2 a,
  51.       body.section-3 #navlist li#nav-3 a,
  52.       body.section-4 #navlist li#nav-4 a
  53.     {
  54.     background: #fff;
  55.     border-bottom: 1px solid #fff;
  56.     color: #000;
  57.     }
  58.  
  59.     #navlist #subnav-1,
  60.     #navlist #subnav-2,
  61.     #navlist #subnav-3,
  62.     #navlist #subnav-4
  63.     {
  64.       display: none;
  65.       width: 90%;
  66.     }
  67.  
  68.     body.section-1 #navlist ul#subnav-1,
  69.     body.section-2 #navlist ul#subnav-2,
  70.     body.section-3 #navlist ul#subnav-3,
  71.     body.section-4 #navlist ul#subnav-4
  72.     {
  73.       display: inline;
  74.       left: 10px;
  75.       position: absolute;
  76.       top: 95px;
  77.     }
  78.  
  79.     body.section-1 #navlist ul#subnav-1 a,
  80.     body.section-2 #navlist ul#subnav-2 a,
  81.     body.section-3 #navlist ul#subnav-3 a,
  82.     body.section-4 #navlist ul#subnav-4 a
  83.     {
  84.       background: #fff;
  85.       border: none;
  86.       border-left: 1px solid #ccc;
  87.       color: #999;
  88.       font-size: smaller;
  89.       font-weight: bold;
  90.       line-height: 10px;
  91.       margin-right: 4px;
  92.       padding: 2px 10px 2px 10px;
  93.       text-decoration: none;
  94.     }
  95.  
  96.     #navlist ul a:hover { color: #f00 !important; }
  97.  
  98.     #contents
  99.     {
  100.       background: #fff;
  101.       border: 1px solid #ccc;
  102.       border-top: none;
  103.       clear: both;
  104.       margin: 0px;
  105.       padding: 15px;
  106.     }
  107.  
  108.